.home{
    width: 100%;
    height: 100%;


    .home-banner{
        width: 100%;
        height: 200px;
        background: #ccc;
    }

    .home-body{
        
        width: 100%;
        


        .body-one{
            display: flex;

            .home-ranking{
                flex: 2;
                background: url(../imgs/index-card-rank.png) no-repeat left bottom rgba(21, 146, 204, 100) ;
                height: 150px;
                border-radius: 15px;
                background-size: 120px;
                margin: 20px 11px 20px 15px;

                .ranking-one{
                    font-size: 20px;
                    color: rgba(0, 78, 115, 100);
                    margin-top: 14px;
                    margin-left: 14px;
                }

                .ranking-two{
                    font-size: 80px;
                    color: white;
                    margin-left: 90px;
                    margin-top: 10px;
                }
            }

            .home-cumulative{
                flex: 3;
                background:url(../imgs/index-card-sum.png) no-repeat left bottom rgba(123, 203, 245, 100);
                height: 150px;
                border-radius: 15px;
                background-size: 110px;
                margin: 20px 28px 20px 11px;
                
                .cumulative-one{
                    font-size: 20px;
                    color: rgba(0, 78, 115, 100);
                    margin-top: 14px;
                    margin-left: 14px;
                }

                .cumulative-btn{
                    width: 100px;
                    line-height: 23px;
                    border: 3px solid rgba(0, 81, 119, 100);
                    color: rgba(0, 78, 115, 100);
                    border-radius: 20px;
                    background-color: rgba(123, 203, 245, 100);
                    margin-left: 100px;
                    margin-top: 50px;
                }

            }


        }

        .body-two{
            display: flex;

            .home-data{
                flex: 1;
                height: 110px;
                background: url(../imgs/index-card-data.png) no-repeat center;
                background-size: cover;
                border-radius: 15px;
                margin: 0px 15px 20px 11px;

                p{
                    color: white;
                    margin-top: 10px;
                    margin-left: 10px;
                }
            }

            .home-badge{
                flex: 1;
                height: 110px;
                background:url(../imgs/index-card-badge.png) no-repeat  left bottom #a8b3e6;
                background-size: 100px;
                border-radius: 15px;
                margin: 0px 28px 20px 11px;

                .badge-one{
                    color:#005177;
                    font-size: 16px;
                    margin-left: 14px;
                    margin-top: 12px;
                    font-weight: bold;
                }

                .badge-two{
                    margin-left: 104px;

                    .two-one{
                        color: rgba(0, 78, 115, 100);
                        font-size: 70px;
                        
                    }

                    .two-two{
                        font-weight: bold;
                        color: rgba(0, 78, 115, 100);
                    }
                }
            }

        }

        .home-course{
            height: 110px;
            background: url(../imgs/course-img04.jpg) no-repeat center / cover;
            border-radius: 15px;
            margin: 0px 25px 20px 10px;


            p{
                color: white;
                padding-top: 10px;
                padding-left: 10px;
            }
        }

        .home-run{
            height: 110px;
            background: url(../imgs/户外跑步.jfif) no-repeat bottom /cover;
            border-radius: 15px;
            margin: 0px 25px 20px 10px;

            p{
                color: white;
                padding-top: 10px;
                padding-left: 10px;
            }
        }
    }


}